<!--查看详情界面  -->
<template>
  <div>
    <el-dialog
      title="查看详情"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="handleClose"
    >
      <!-- 表单部分 -->
      <el-form
        :model="ruleForm"
        :rules="rules"
        ref="ruleForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="订单编号">
          <el-input v-model="ruleForm.orderNum" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="姓名" prop="name">
          <el-input v-model="ruleForm.name"></el-input>
        </el-form-item>
        <el-form-item label="科室" prop="department">
          <el-input v-model="ruleForm.department"></el-input>
        </el-form-item>
        <el-form-item label="订单类型" prop="type">
          <el-select v-model="ruleForm.type" filterable placeholder="">
            <el-option
              v-for="item in orderOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="医生" prop="docter">
          <el-input v-model="ruleForm.docter"></el-input>
        </el-form-item>
        <el-form-item label="折扣(元)" prop="discount">
          <el-input v-model="ruleForm.discount"></el-input>
        </el-form-item>
        <el-form-item label="应收(元)" prop="receive">
          <el-input v-model="ruleForm.receive"></el-input>
        </el-form-item>
        <el-form-item label="实收(元)" prop="trueRec">
          <el-input v-model="ruleForm.trueRec"></el-input>
        </el-form-item>
        <el-form-item label="医保(元)" prop="yb">
          <el-input v-model="ruleForm.yb"></el-input>
        </el-form-item>
        <el-form-item label="会员卡(元)" prop="vipcard">
          <el-input v-model="ruleForm.vipcard"></el-input>
        </el-form-item>
        <el-form-item label="现金(元)" prop="cash">
          <el-input v-model="ruleForm.cash"></el-input>
        </el-form-item>
        <el-form-item label="支付宝(元)" prop="zfb">
          <el-input v-model="ruleForm.zfb"></el-input>
        </el-form-item>
        <el-form-item label="微信(元)" prop="wx">
          <el-input v-model="ruleForm.wx"></el-input>
        </el-form-item>
        <el-form-item label="会员卡(元)" prop="card">
          <el-input v-model="ruleForm.card"></el-input>
        </el-form-item>
        <el-form-item label="收费日期" prop="date">
          <el-date-picker
            v-model="ruleForm.date"
            type="date"
            placeholder="选择日期"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="收费员" prop="tollCollector">
          <el-input v-model="ruleForm.tollCollector"></el-input>
        </el-form-item>
      </el-form>

      <!-- 按钮部分 -->
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="submitForm('ruleForm')"
          >确认修改</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { EditStaticData } from "../../../api/StaticApi.js";
import bus from "../../../utils/eventBus.js";
export default {
  data() {
    return {
      dialogVisible: false,
        orderOptions: [{
          value: '处方开立',
          label: '处方开立'
        },
        {
          value: '待办',
          label: '待办'
        },
        {
          value: '开立中',
          label: '开立中'
        }
        ],
      ruleForm: {
        orderNum: "",
        name: "",
        department: "",
        docter: "",
        discount: "",
        receive: "",
        trueRec: "",
        yb: "",
        vipcard: "",
        cash: "",
        zfb: "",
        wx: "",
        card: "",
        date: "",
        tollCollector: "",
        type: "处方开立",
      },
      rules: {
        name: [
          { required: true, message: "请输入用户名", trigger: "blur" },
          { min: 2, max: 5, message: "长度在 2 到 5 个字符", trigger: "blur" },
        ],
        department: [
          { required: true, message: "请输入科室", trigger: "blur" },
        ],
        docter: [
          { required: true, message: "请输入医生姓名", trigger: "blur" },
        ],
        discount: [{ required: true, message: "请输入折扣", trigger: "blur" }],
        receive: [
          { required: true, message: "请输入应收价格", trigger: "blur" },
        ],
        trueRec: [
          { required: true, message: "请输入实际收的价格", trigger: "blur" },
        ],
        yb: [{ required: true, message: "请输入医保", trigger: "blur" }],
        vipcard: [
          { required: true, message: "请输入会员卡收入", trigger: "blur" },
        ],
        cash: [{ required: true, message: "请输入现金收入", trigger: "blur" }],
        zfb: [{ required: true, message: "请输入支付宝收入", trigger: "blur" }],
        wx: [{ required: true, message: "请输入微信收入", trigger: "blur" }],
        card: [
          { required: true, message: "请输入银行卡收入", trigger: "blur" },
        ],
        date: [{ required: true, message: "请输入缴费日期", trigger: "blur" }],
        tollCollector: [
          { required: true, message: "请输入收费员", trigger: "blur" },
        ],
      },
    };
  },
  mounted() {
    bus.$on("openStaticDialog", (obj) => {
      this.dialogVisible = true;
      this.ruleForm = { ...obj };
      // console.log("接收到了：", obj);
    });
  },
  methods: {
    handleClose(done) {
      done();
    },
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          EditStaticData(this.ruleForm).then((res) => {
            console.log(res);
            if (res.code == 200) {
              this.$message({
                message: "修改成功",
                type: "success",
              });
              this.dialogVisible = false;
              this.$emit("resetdata");
            } else {
              this.$message({
                message: res.msg,
                type: "warning",
              });
              this.dialogVisible = false;
            }
          });
        } else {
          this.$message({
            message: "请输入正确的信息",
            type: "warning",
          });
          return false;
        }
      });
    },
  },
};
</script>


<style lang="less" scoped>
</style>